import { type App, createApp } from 'vue'

import AppVue from './App.vue'
import pinia from '@/stores'
import router from '@/router'
import i18n from '@/locale'
import '@/styles/main.scss'
import 'element-plus/theme-chalk/dark/css-vars.css'
import 'element-plus/es/components/message-box/style/css'
import 'element-plus/es/components/message/style/css'
import 'element-plus/dist/index.css'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import directives from '@/directives/index'
import globalComponents from '../../components/global'
import 'xe-utils'
import VXETable from 'vxe-table'
import 'vxe-table/lib/style.css'
import 'default-passive-events'
import { setupProdMockServer } from './mockProdServer'

function useTable(app: App) {
  app.use(VXETable)
  // 给 vue 实例挂载内部对象，例如：
  // app.config.globalProperties.$XModal = VXETable.modal
  // app.config.globalProperties.$XPrint = VXETable.print
  // app.config.globalProperties.$XSaveFile = VXETable.saveFile
  // app.config.globalProperties.$XReadFile = VXETable.readFile
}
const app = createApp(AppVue)
app.use(pinia)
app.use(router)
app.use(i18n)
app.use(directives)
app.use(globalComponents)
app.use(useTable)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}
app.mount('#app')
setupProdMockServer()
